<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
    <title>对外求助基本信息</title>
    <meta content="Admin Dashboard" name="description"/>
    <meta content="Mannatthemes" name="author"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>

    <link rel="shortcut icon" href="images/favicon.ico">
    <link href="css/animate.min.css" rel="stylesheet" type="text/css">
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="plugins/dataTables/css/dataTables.bootstrap4.min.css" rel="stylesheet" type="text/css">
    <link href="css/style.css" rel="stylesheet" type="text/css">
    <!--设置全局变量，根据权限，控制动态添加的内容的是否显示-->
    <script>
        let hasDeletePermission = false;
        let hasUpdatePermission = false;
        let hasInsertPermission = false;
    </script>
</head>

<body>
<!--如果有下面的权限，就将变量设置为true，供js文件中进行逻辑判断-->
<shiro:hasPermission name="user:delete">
    <script>
        hasDeletePermission = true;
    </script>
</shiro:hasPermission>
<shiro:hasPermission name="user:update">
    <script>
        hasUpdatePermission = true;
    </script>
</shiro:hasPermission>
<shiro:hasPermission name="user:insert">
    <script>
        hasInsertPermission = true;
    </script>
</shiro:hasPermission>
<!-- Page-Title -->
<div class="row">
    <div class="col-sm-12">
        <div class="page-title-box">
            <div class="btn-group pull-right">
                <ol class="breadcrumb hide-phone p-0 m-0">
                    <!--<li class="breadcrumb-item"><a href="#">用户</a></li>-->
                </ol>
            </div>
            <h4 class="page-title">对外求助基本信息</h4>
        </div>
    </div>
</div>
<!-- end page title end breadcrumb -->
<div class="row">
    <div class="col-lg-12">
        <!--foreignBase添加模块开始-->
        <div class="card">
            <div class="card-body">
                <button type="button" class="btn btn-danger" data-toggle="modal" data-target="#addForeignBaseModal">
                    添加对外求助基本信息
                </button>
                <div class="modal fade" id="addForeignBaseModal" tabindex="-1" role="dialog" style="display: none;"
                     aria-hidden="true">
                    <div class="modal-dialog  bounce  animated">
                        <div class="modal-content">
                            <div class="modal-header">
                                <h5 class="modal-title">添加对外求助基本信息</h5>
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">×</span>
                                </button>
                            </div>
                            <!--String searchArea, Date occurredTime, String details-->
                            <form class="" id="toAddForeignBase" role="form">
                                <div class="modal-body">
                                    <div class="form-group mb-0">
                                        <label for="addSearchArea" class="mb-2 pb-1">搜救海区</label>
                                        <input type="text" class="form-control" name="searchArea" id="addSearchArea"
                                               required/>
                                    </div>

                                    <div class="form-group mb-0">
                                        <label for="addOccurredTime" class="my-2 py-1">发生时间</label>
                                        <input type="datetime-local" class="form-control" name="occurredTime"
                                               id="addOccurredTime" required/>
                                    </div>

                                    <div class="form-group mb-0">
                                        <label for="addDetails" class="my-2 py-1">情况说明</label>
                                        <input type="text" class="form-control" name="details" id="addDetails"
                                               required/>
                                    </div>

                                </div>

                                <div class="modal-footer">
                                    <div>
                                        <button data-dismiss="modal" class="btn btn-secondary waves-effect m-l-5">取消
                                        </button>
                                        <button type="submit"
                                                class="btn btn-primary waves-effect waves-light">提交
                                        </button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--foreignBase添加模块结束-->

        <!--foreignBase更新模块开始-->
        <div class="modal fade" id="updateForeignBaseModal" tabindex="-1" role="dialog" style="display: none;"
             aria-hidden="true">
            <div class="modal-dialog  bounce  animated">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">更新培训信息</h5>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">×</span>
                        </button>
                    </div>

                    <form class="" id="toUpdateForeignBase" role="form">

                        <div class="modal-body">

                            <div class="form-group mb-0">
                                <label for="updateSearchArea" class="mb-2 pb-1">搜救海区</label>
                                <input type="text" class="form-control" name="searchArea" id="updateSearchArea"
                                       required/>
                            </div>

                            <div class="form-group mb-0">
                                <label for="updateOccurredTime" class="my-2 py-1">发生时间</label>
                                <input type="datetime-local" class="form-control" name="occurredTime"
                                       id="updateOccurredTime" required/>
                            </div>

                            <div class="form-group mb-0">
                                <label for="updateDetails" class="my-2 py-1">情况说明</label>
                                <input type="text" class="form-control" name="details" id="updateDetails"
                                       required/>
                            </div>

                        </div>

                        <div class="modal-footer">
                            <div>
                                <button data-dismiss="modal" class="btn btn-secondary waves-effect m-l-5">取消</button>
                                <button type="submit"
                                        class="btn btn-primary waves-effect waves-light">提交
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!--foreignBase更新模块结束-->


        <div class="card">

            <div class="card-body">
                <div id="datatable_wrapper" class="dataTables_wrapper container-fluid dt-bootstrap4 no-footer">
                    <div class="row">
                        <div class="col-sm-12">
                            <table id="datatable" class="table table-bordered dataTable no-footer" role="grid"
                                   aria-describedby="datatable_info" style="width:100%">
                            </table>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div> <!-- end col -->
</div>
<!-- end row -->
<!-- jQuery  -->
<script src="js/lib/jquery.min.js"></script>
<script src="js/lib/popper.min.js"></script>
<script src="js/lib/bootstrap.min.js"></script>
<!--tableEdit js-->
<script src="plugins/dataTables/js/jquery.dataTables.min.js"></script>
<script src="plugins/dataTables/js/dataTables.bootstrap4.min.js"></script>
<script src="plugins/dataTables/js/dataTables.responsive.min.js"></script>

<script src="js/lib/modernizr.min.js"></script>
<script src="js/lib/waves.js"></script>
<script src="js/lib/jquery.nicescroll.js"></script>
<script src="js/lib/modal-animation.init.js"></script>
<script src="js/lib/jquery.form.js"></script>

<!--文件相关js-->
<script src="plugins/dataTables/js/dataTables.buttons.min.js"></script>
<script src="plugins/dataTables/js/jszip.min.js"></script>
<script src="plugins/dataTables/js/buttons.html5.min.js"></script>

<!-- Parsley js 表单验证-->
<script type="text/javascript" src="plugins/parsley/parsley.min.js"></script>

<!-- App js -->
<script src="js/lib/app.js"></script>
<script src="js/lib/md5.js"></script>
<script src="js/pages/table.js"></script>
<script src="js/pages/foreign/foreignBase.js"></script>
</body>
</html>